<template>
    <div>
        <van-nav-bar title="个人信息" left-text="" left-arrow @click-left="router.push('/my')" />
        <div class="info">
            <div class="info-item"  style="height: 100px;">
                <div class="info-item-title">头像</div>
                <div class="info-item-content">
                    <img src="./state/未登录头像.svg" alt="">
                    <!-- <img src="./state/未登录头像.svg" alt=""> -->
                </div>
            </div><div class="info-item">
                <div class="info-item-title">ID</div>
                <div class="info-item-content">
                    <span>张三</span>
                    <!-- <span>张三</span> -->
                    <span>
                        <img src="./state/复制.png" alt="" style="width: 20px;position: relative; top: 5px">
                    </span>
                </div>
            </div><div class="info-item">
                <div class="info-item-title">昵称</div>
                <!-- <div class="info-item-content">{{user.username}}</div> -->
                <div class="info-item-content">张三</div>
            </div>
            <div class="info-item">
                <div class="info-item-title">性别</div>
                <div class="info-item-content">1231</div>
                <!-- <div class="info-item-content">{{user.gender}}</div> -->
            </div>
        </div>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
let router = useRouter()
let user = ref({})
</script>

<style scoped>
.info-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border-bottom: 1px solid #eee;
    height: 60px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    background-color: #fff;
    box-sizing: border-box;
    position: relative;
}
</style>